<template>
  <div>
	<!-- 新闻列表 -->
    <ul class="mui-table-view" v-for="item in newlist":key="item.id">
				<li class="mui-table-view-cell mui-media">
					<router-link :to="'/home/newslistinfo/'+item.id">
						<img class="mui-media-object mui-pull-left" :src="item.img_url">
						<div class="mui-media-body">
							<h1>{{item.title}}</h1>
							<p class='mui-ellipsis'><span>发表时间：{{item.add_time | dateFormat}}</span>点击：{{item.click}}</span></p>
						</div>
					</router-link>
				</li>
			</ul>
  </div>
</template>
<script>
import {Toast} from 'mint-ui'
    export default({
		data(){
			return {
				newlist:[]
			}
		},
		created () {
			this.getNewlist();
		},
		methods:{
			getNewlist(){
				this.$http.get('api/getnewslist').then(result=>{
					// console.log(result.body)
					if(result.body.status===0){
						this.newlist=result.body.message
					}else{
						Toast('获取数据信息失败了')
					}
				})
			}
		}
	})
    
</script>

<style lang="scss" scoped>
//设置字体大小
.mui-media-body{
    h1 {
        font-size:14px;
	}
	//设置发表时间的字体颜色  
    .mui-ellipsis{
        font-size: 12px;
        display: flex;
        justify-content: space-between;//设置左右对齐
        color:  #26a2ff;
    }
}


</style>

